<template>
  <div class="header">
    <div class="logo" @click="clickLogo">
      <Logo />
    </div>
    <div class="account">
      <Account />
    </div>
  </div>
</template>

<script setup>
  import Logo from './logo.vue';
  import Account from './account.vue';

  const clickLogo = () => {
    console.log('logo被点击了');
  };
</script>

<style scoped lang="scss">
  @import 'assets/style/common.scss';
  .header {
    height: 100%;
    @include flex-row-between;
    .logo {
      width: 11%;
      @include flex-center;
      :hover {
        cursor: pointer;
        opacity: 0.6;
      }
    }
    .account {
      @include flex-center;
    }
  }
</style>
